<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>编辑广告</title>
	<link rel="stylesheet" type="text/css" href="{{asset('common/css/commonality.css')}}">
	<link rel="stylesheet" type="text/css" href="{{asset('/css/system/advertising.css')}}">
    <link rel="stylesheet" type="text/css" href="{{URL::asset('css/app.css')}}">
	<link rel="stylesheet" href="{{url('/common/css/element.css')}}">
    {{--<script src="//code.jquery.com/jquery.js"></script>--}}
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <style>
        .avatar-uploader .el-upload {
            border: 1px dashed #d9d9d9;
            border-radius: 6px;
            cursor: pointer;
            position: relative;
            overflow: hidden;
        }
        .avatar-uploader .el-upload:hover {
            border-color: #409EFF;
        }
        .avatar-uploader-icon {
            font-size: 28px;
            color: #8c939d;
            width: 178px;
            height: 178px;
            line-height: 178px;
            text-align: center;
        }
        .avatar {
            width: 360px;
            height: 470px;
            display: block;
        }
    </style>
</head>
<body>
	<div class="pop_up_box">
		<div class="left_box">
            <div id="app" class="article">
                <el-upload
                        class="avatar-uploader"
                        action="http://{{$_SERVER['HTTP_HOST']}}/admin/upload"
                        :show-file-list="false"
                        :on-success="handleAvatarSuccess"
                        :before-upload="beforeAvatarUpload">
                    <img v-if="imageUrl" :src="imageUrl" class="avatar" style="width: 180px;height: auto">
                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
                点击图片更改照片
            </div>
		</div>
		<div class="center_box">
			<form method="post" action="editAdv">
			{{csrf_field()}}
			    <input type="hidden" name="id" value="{{$info->id}}"/>
				<p><label>优先级：&nbsp;&nbsp;&nbsp;<input type="text" name="order"  value="{{$info->order}}" placeholder="（1-20，数越大，优先级越低）" required></label></p>
                <p><label>广告名称：<input type="text" name="name" value="{{$info->name}}" placeholder="请输入" required></label></p>
                <p><label>广告链接：<input type="text" name="jump_url" value="{{$info->jump_url}}" placeholder="请输入" required></label></p>
				<input type="submit" name="" value="提交" class="save btn_pop" style="width:140px;">
                <input type="hidden" name="img_url" class="img">
			</form>
            @include('flash::message')
		</div>
		<div class="right_box"></div>
	</div>
</body>
</html>
<script type="text/javascript" src="{{asset('/common/js/jquery.min.js')}}"></script>
<script src="{{asset('/common/js/validation/jquery.validate.min.js')}}"></script>
<script src="{{asset('/common/js/validation/localization/messages_zh.min.js')}}"></script>
{{--<script type="text/javascript" src="{{url('common/js/jquery-1.10.1.min.js')}}"></script>--}}
{{--<script type="text/javascript" src="../../common/js/commonality.js"></script>--}}
{{--<script type="text/javascript" src="../../../layui-v2.3.0/layui/layui.all.js"></script>--}}
{{--<script src="../../js/system/advertising.js"></script>--}}
<script src="{{url('/common/js/element/vue.js')}}"></script>
<script src="{{url('/common/js/element/element.js')}}"></script>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                imageUrl: '{{$info->img_url}}'
            };
        },
        methods: {
            handleAvatarSuccess(res, file) {
                $('.img').val(res.res.url)
                this.imageUrl = URL.createObjectURL(file.raw);
            },
            beforeAvatarUpload(file) {
                //const isJPG = file.type === 'image/jpeg';
                //const isLt2M = file.size / 1024 / 1024 < 2;

                // if (!isJPG) {
                //     this.$message.error('上传头像图片只能是 JPG 格式!');
                // }
                // if (!isLt2M) {
                //     this.$message.error('上传头像图片大小不能超过 2MB!');
                // }
                // return isJPG && isLt2M;
            }
        }
    })
</script>


